document.addEventListener('DOMContentLoaded', function() {
    const instructions = document.getElementById('instructions');
    const startButton = document.getElementById('startButton');
    const speakButton = document.getElementById('speakButton');
    const numberDisplay = document.getElementById('numberDisplay');
    const userInput = document.getElementById('userInput');
    const verifyButton = document.getElementById('VérifierBoutton');
    const feedback = document.getElementById('correction');
    const scoreDisplay = document.getElementById('scoreDisplay');

    let currentNumber;
    let score = 0;
    let attempts = 0;
    const maxAttempts = 10;

    function generateNumber() {
        currentNumber = Math.floor(Math.random() * 49);
        speakNumber();
    }

    function speakNumber() {
        const msg = new SpeechSynthesisUtterance(currentNumber.toString());
        msg.lang = 'fr-FR';
        window.speechSynthesis.speak(msg);
    }

    startButton.addEventListener('click', function() {
        score = 0;
        attempts = 0;
        scoreDisplay.style.display = 'none';
        feedback.style.display = 'none';
        startButton.style.display = 'none';
        userInput.value = '';
        instructions.textContent = "Écoutez le nombre, puis écrivez-le.";
        generateNumber();
        speakButton.style.display = 'inline-block';
        userInput.style.display = 'inline-block';
        verifyButton.style.display = 'inline-block';
    });

    speakButton.addEventListener('click', function() {
        speakNumber();
    });

    verifyButton.addEventListener('click', function() {
        const userNumber = parseInt(userInput.value, 10);
        feedback.style.display = 'block';
        if (!isNaN(userNumber) && userNumber === currentNumber) {
            feedback.textContent = "Correct !";
            score++;
        } else {
            feedback.textContent = `Le nombre dicté est : ${currentNumber}`;
        }
        attempts++;
        userInput.value = '';
        if (attempts < maxAttempts) {
            generateNumber();
        } else {
            scoreDisplay.textContent = `Votre score : ${score} sur ${maxAttempts}`;
            scoreDisplay.style.display = 'block';
            startButton.style.display = 'inline-block';
            speakButton.style.display = 'none';
            userInput.style.display = 'none';
            verifyButton.style.display = 'none';
            instructions.textContent = "Cliquez sur \"Démarrer\" pour recommencer.";
        }
    });
});